<!DOCTYPE html>
<html xmlns:v-on="http://www.w3.org/1999/xhtml" xmlns:th="http://www.w3.org/1999/xhtml"
	  xmlns:v-bind="http://www.w3.org/1999/xhtml">
<div th:replace="/common/header :: header"></div>
<body >

<!--<div class="home_bac">-->
<!--	<div class="home_header">-->
<!--		<div class="clearfix warp">-->
<!--			<a href="#" class="home_lol"><img src="images/logo.png"></a>-->
<!--			<div class="clearfix home_lor">-->
<!--				<a href="#" class="home_user">-->
<!--					<img src="images/a8.png" class="">132000000000-->
<!--				</a>-->
<!--				<a href="#" class="home_exit">-->
<!--					<img src="images/a10.png">Exit-->
<!--				</a>-->
<!--			</div>-->
<!--			&lt;!&ndash; <header class="cd-header"><a href="#0" class="cd-3d-nav-trigger nav_open"><span></span></a></header> &ndash;&gt;-->
<!--		</div>-->
<!--	</div>-->
<!--	<div class="home_nav">-->
<!--		<ul class="home_nav_list clearfix">-->
<!--			<li class="active"><a href="#">Home</a></li>-->
<!--			<li><a href="#">Order</a></li>-->
<!--			<li><a href="#">Shuttle</a></li>-->
<!--			<li><a href="#">Charter</a></li>-->
<!--			<li><a href="#">Auction</a></li>-->
<!--			<li><a href="#">Cashier</a></li>-->
<!--		</ul>-->
<!--	</div>-->
<style>
	.home_ipu{width: 61%;}
	.timsg{clear: both;display: none;text-align: center;color: #fff;}
	.layui-layer-setwin {
		position: absolute;
		right: 5px;
		bottom: 2px;
		font-size: 0px;
		line-height: initial;
	}
</style>
	<div class="home_mol" id="app">
		<div class="home_mtab" style="padding: 0 0 20px 0;">
<!--			<p class="home_tit">Information  Center</p>-->
			<ul class="home_bot" style="border: 0">
				<li class="clearfix">
					<p class="home_pfl">Contact Number</p>
					<p class="home_pfr">{{currentUser.phone}}</p>
				</li>
				<li class="clearfix">
					<p class="home_pfl">Email</p>
					<p class="home_pfr">{{currentUser.user_email}}</p>
				</li>

				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="乘客、游客人数">Passengers</p>
					<div class="clearfix home_ipu">
						<input type="text" class="home_input " v-model="order.passengers" placeholder="Number" >

					</div>
					<div class="timsg">Number</div>
<!--					<img src="images/a13.png" class="order_wen">-->
				</li>
				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="Pick Up Time">Pick Up Time</p>
					<div class="clearfix home_ipu">
						<input type="text" v-model="order.time_depart" class="home_input"  id="time_depart" placeholder="yyyy-MM-dd HH:mm:ss">

						<img src="/images/a12.png" class="home_rli">
					</div>
					<!--<div class="timsg">DateTime</div>-->
				</li>
				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="From">From</p>
					<div class="order_hi">
						<div class="clearfix home_ipu">
							<input type="text" v-model="order.fromwhere" class="home_input" placeholder="From" >
						</div>
						<p class="order_fpirs"  v-on:click="addAddress">Via</p>
					</div>
				</li>
				<li class="clearfix" v-for="(item,index) in order.stop">
					<p class="home_pfl show_tips" tipsdata="And">And</p>
					<div class="order_hi">
						<div class="clearfix home_ipu">
							<input type="text" v-model="order.stop[index].stop" class="home_input" placeholder="And" >
						</div>
						<p class="order_fpirs" v-on:click="reduceAddress">-</p>
					</div>
				</li>
				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="To">To</p>
					<div class="clearfix home_ipu">
						<input type="text" class="home_input" v-model="order.towhere" placeholder="To">
					</div>
				</li>
				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="Big Luggage">Big Luggage</p>
					<div class="clearfix home_ipu">
						<input type="text" class="home_input" v-model="order.big_luggage" placeholder="Number">
					</div>
				</li>
				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="Carry Luggage">Carry Luggage</p>
					<div class="clearfix home_ipu">
						<input type="text" class="home_input" v-model="order.carry_luggage" placeholder="Number">
					</div>
				</li>
				<li class="clearfix layui-form">
					<p class="home_pfl show_tips" tipsdata="通行费(Y/N)">Tolls</p>
					<div class="clearfix home_ipu">
						<input type="checkbox" lay-filter="tolls" v-model="order.tolls" title="Tolls" lay-skin="primary">
					</div>
				</li>
				<li class="clearfix layui-form">
					<p class="home_pfl show_tips" tipsdata="机场停车费(Y/N)">AirportParkingFee</p>
					<div class="clearfix home_ipu">
						<input type="checkbox" lay-filter="APF" v-model="order.APF" title="AirportParkingFee" lay-skin="primary">
					</div>
				</li>

				<li class="clearfix layui-form">
					<p class="home_pfl show_tips" tipsdata="拖车需要(Y/N)">Trailer Required</p>
					<div class="clearfix home_ipu">
						<input type="checkbox" lay-filter="trailer"  v-model="order.trailer"  title="Trailer Required" lay-skin="primary">
					</div>
				</li>

				<li class="clearfix">
					<p class="home_pfl show_tips" tipsdata="额外要求extra_request">Remarks</p>
					<div class="clearfix home_ipu">
						<textarea class="order_tarea" v-model="order.extra_request"></textarea>
					</div>
				</li>
				<div v-bind:style='{display:showMore? "block" : "none" }'>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="Other Contact Number">Other Contact Number</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.other_contact_phone" placeholder="Other Contact Number">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="Other Email">Other Email</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.other_contact_email" placeholder="Other Email">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="Flight_id">Flight_id</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.flight_id" placeholder="Flight_id">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="Baby Seats(0-3yr)">Baby Seats(0-3yr)</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.babyseats_s" placeholder="Number">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="Baby Seats(3-7yr)">Baby Seats(3-7yr)</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.babyseats_b" placeholder="Number">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="WH_with">WH_with</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.WH_with" placeholder="Number">
						</div>
					</li>
					<li class="clearfix">
						<p class="home_pfl show_tips" tipsdata="WH_OnBoard">WH_OnBoard</p>
						<div class="clearfix home_ipu">
							<input type="text" class="home_input" v-model="order.WH_OnBoard" placeholder="Number">
						</div>
					</li>
					<li class="clearfix layui-form">
						<p class="home_pfl show_tips" tipsdata="是否有消费税(Y/N - 选中Y的话,则价格乘以1.1,才能要求打印发票)">GST</p>
						<div class="clearfix home_ipu">
							<input type="checkbox" lay-filter="GST" v-model="order.GST" title="Is there a consumption tax" lay-skin="primary" >
						</div>
					</li>
					<li class="clearfix layui-form">
						<p class="home_pfl show_tips" tipsdata="国家公园门票(Y/N)">NPEF</p>
						<div class="clearfix home_ipu">
							<input type="checkbox" lay-filter="NPEF" v-model="order.NPEF" title="National Park Entry Fee" lay-skin="primary" >
						</div>
					</li>
					<li class="clearfix layui-form">
						<p class="home_pfl show_tips" tipsdata="司机膳食及住宿(Y/N)">Driver_DM</p>
						<div class="clearfix home_ipu">
							<input type="checkbox" lay-filter="driver_DM" v-model="order.driver_DM" title="Driver Meal and Accommodation" lay-skin="primary" >
						</div>
					</li>
				</div>


<!--				<li class="clearfix layui-form">-->
<!--					<p class="home_pfl">Order Type</p>-->
<!--					<div class="clearfix home_ipu">-->
<!--						<div class="layui-inline order_put">-->
<!--							<select name="interest" lay-filter="aihao" v-model="order.order_type">-->
<!--								<option value="0" >待审核</option>-->
<!--								<option value="1">发布</option>-->
<!--							</select>-->
<!--						</div>-->
<!--					</div>-->
<!--				</li>-->
				<li class="clearfix">
					<div class="home_button" v-on:click="showMoreFun">{{showMoreTxt}}</div>
				</li>
				<li class="clearfix">
<!--					<p class="home_pfl">Options</p>-->
<!--					<dl class="order_ohi clearfix">-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Big Luggage</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--							<p class="order_pfr">Pieces</p>-->
<!--							<input type="text" class="order_miput">-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Carry Luggage</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--							<p class="order_pfr">Pieces</p>-->
<!--							<input type="text" class="order_miput">-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Baby Seats</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--							<p class="order_pfr">0-3yr</p>-->
<!--							<input type="text" class="order_miput">-->
<!--							<p class="order_pfrs">3-7yr</p>-->
<!--							<input type="text" class="order_miput">-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Wheel Chairs</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--							<p class="order_pfr">WithPerson</p>-->
<!--							<input type="text" class="order_miput">-->
<!--							<p class="order_pfrs2">or On Board Only</p>-->
<!--							<input type="text" class="order_miput">-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Trailer Required</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wont">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">Toll Included</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--						</dd>-->
<!--						<dd class="order_dil clearfix">-->
<!--							<div class="clearfix order_wonts">-->
<!--								<input type="checkbox" class="order_che">-->
<!--								<p class="home_pfr">river Meal and Accommodation</p>-->
<!--								<img src="images/a13.png" class="order_wen">-->
<!--							</div>-->
<!--						</dd>-->
<!--					</dl>-->
				</li>



				<li class="clearfix">
					<div class="home_button" v-on:click="save">Let Me See the Order</div>
				</li>
			</ul>
		</div>
<!--		<div class="home_foot">-->
<!--			<div class="clearfix lg_boa">-->
<!--				<a href="#">Contact Us</a>-->
<!--				<a href="#">About Us</a>-->
<!--				<a href="#">Readme Before Use</a>-->
<!--			</div>-->
<!--			<p class="lg_boits">@Better Price Better Go</p>-->
<!--		</div>-->
	</div>


	
</div>


<script>
// nav
$(document).ready(function($){
	$('.cd-3d-nav-trigger').on('click', function(){
		toggle3dBlock(!$('.cd-header').hasClass('nav-is-visible'));
	});

	function toggle3dBlock(addOrRemove) {
		if(typeof(addOrRemove)==='undefined') addOrRemove = true;	
		$('.cd-header').toggleClass('nav-is-visible', addOrRemove);
	}

	/*$(".home_input").hover(function () {
		$(".timsg").hide();
		$(this).parents().next(".timsg").show()
	},function () {
		$(".timsg").hide();
	})*/
});
</script>
<script th:inline="javascript">
	/*加载layui组件*/
	var laydate = null, laypage = null, layer = null, table = null, carousel = null, upload = null, element = null ,form = null;
	layui.use([ 'laydate', 'laypage', 'layer', 'table', 'carousel', 'upload', 'element' ], function() {
		laydate = layui.laydate //日期
				, layer = layui.layer //弹层
				, form = layui.form
		//国际版
		laydate.render({
			elem: '#time_depart'
			,type: 'datetime'
			,lang: 'en'
			,btns:[ 'now', 'confirm']
			,trigger: 'click' //采用click弹出
			,done: function(value, date, endDate){
				app.order.time_depart = value;
			}
			// ,value:new Date()
		});
		laydate.render({
			elem: '#insur_expired'
			,lang: 'en'
			,btns:[ 'now', 'confirm']
			,trigger: 'click' //采用click弹出
			,done: function(value, date, endDate){
				app.currentUser.driver.insur_expired = value;
			}
			// ,value:new Date()
		});
		form.on('checkbox(trailer)', function(data){
			console.log(data);
			app.order.trailer= data.value;
		});
		form.on('checkbox(driver_DM)', function(data){
			console.log(data);
			app.order.driver_DM= data.value;
		});

	});
	var s = JSON.parse('[[${session.currentUser}]]');
	var addOrder_url = Bus4uUtil.serverUrl+"order/save";
	var app = new Vue({
		el:"#app",
		data:{
			showMore:0,
			showMoreTxt:'展开更多条件',
			addAddressList:[],
			currentUser:s,
			order:{
				// passengers:2,
				time_depart:new Date().getFullYear()+"-" +
						(new Date().getMonth()<10? "0"+(+new Date().getMonth()+1) : new Date().getMonth() )+"-"+
						(new Date().getDate()<10? "0"+(+new Date().getDate()+1) : new Date().getDate() )+ " " +
						(new Date().getHours()<10? "0"+(+new Date().getHours()+1) : new Date().getHours() )+":"+
						(new Date().getMinutes()<10? "0"+(+new Date().getMinutes()+1) : new Date().getMinutes() )+":"+
						(new Date().getSeconds()<10? "0"+(+new Date().getSeconds()+1) : new Date().getSeconds() ),

				// fromwhere:"CQ",
				// towhere:"CD",
				big_luggage:"0",
				carry_luggage:"0",
				babyseats_s:"0",
				babyseats_b:"0",
				// trailer:"5",
				WH_with:"0",
				WH_OnBoard:"0",

				toll:"",
				APF:"",
				trailer:"",
				GST:"",
				NPEF:"",
				driver_DM:"on",

				order_type:"0"
			}
		},
		methods: {
			save: function (event) {
				//执行新增订单
				console.log(this.order)
				$.ajax({
					url:addOrder_url,
					type:"post",
					data:this.order,
					success:function(d){
						if(d.code=="0"){
							//修改成功,关闭新增页面,并且带订单状态为New的搜索条件执行搜索一次
							parent.layer.closeAll();
							layer.msg("操作成功")
							// search
							// parent.location.reload();
						}else{
							layer.msg(d.msg)
						}
					}
				});
			},
			//增加 停留地点
			addAddress:function () {
				if(this.addAddressList.length>4){
					layer.msg("最多只能增加5个");
					return false;
				}
				let obj = {};
					obj.stop = null;
				this.addAddressList.push(obj);
				this.$set(this.order,"stop",this.addAddressList);
				console.log(this.order.stop.length)
			},
			//删除 停留地点
			reduceAddress:function () {
				this.addAddressList.pop();
				this.$set(this.order,"stop",this.addAddressList);
				console.log(this.order.stop.length)
			},
			//显示更多条件
			showMoreFun:function() {
				this.showMore ? this.showMore=0 : this.showMore=1;
				this.showMore ? this.showMoreTxt='收起更多条件' : this.showMoreTxt='展开更多条件';
			}
		},
	});

</script>
</body>
</html>
